<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>比赛分析应用</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="container">
        <h1>崩坏学园2赌马分析</h1>
        
        <div class="import-section">
            <input type="file" id="csvFile" accept=".csv">
            <button id="importBtn">导入CSV</button>
            <button id="sampleBtn">加载示例数据</button>
            <button id="downloadSampleBtn">下载示例CSV</button>
            <button id="loadFromURLBtn">从URL加载</button>
        </div>
        
        <div class="filter-section">
            <div class="filter-controls">
                <div class="select-group">
                    <label for="leftPlayer">左侧选手:</label>
                    <select id="leftPlayer"></select>
                </div>
                <div class="select-group">
                    <label for="rightPlayer">右侧选手:</label>
                    <select id="rightPlayer"></select>
                </div>
                <button id="filterBtn">筛选</button>
                <button id="analyzeBtn">分析</button>
            </div>
            <div id="analysisResult" class="analysis-result"></div>
        </div>
        
        <div class="table-container">
            <table id="matchesTable">
                <thead>
                    <tr>
                        <th>场次</th>
                        <th>时间</th>
                        <th>左侧选手</th>
                        <th>左侧赔率</th>
                        <th>右侧选手</th>
                        <th>右侧赔率</th>
                        <th>减益1</th>
                        <th>减益2</th>
                        <th>减益3</th>
                        <th>胜者</th>
                    </tr>
                </thead>
                <tbody></tbody>
            </table>
        </div>
    </div>
    
    <script src="script.js"></script>
</body>
</html>
